import { useState, useEffect } from 'react';
import { Form, Input, Button } from 'antd';
import FileList from '@/components/FileLists';
import API from '@/api';
import { goBack } from '@/utils/util';
const NoticeDetail = ({ history }) => {
  const [state, setstate] = useState({});
  const id = history.location.query.id;

  const initState = () => {
    API.getMsgById({ id }).then((res) => {
      if (res?.t) {
        const fileList = JSON.parse(res?.t?.afficheFileList || null);
        setstate({ ...res.t, fileList });
      }
    });
  };
  useEffect(() => {
    initState();
  }, []);
  return (
    <div className="main-x bgf">
      <Form className="form-x max-x">
        <Form.Item label="公告标题">
          <Input readOnly value={state.title}></Input>
        </Form.Item>
        <Form.Item label="公告内容">
          {state.details ? (
            <div
              className="notice-cont"
              dangerouslySetInnerHTML={{ __html: state.details }}
            ></div>
          ):''}
        </Form.Item>
        <Form.Item label="附件列表">
          <FileList
            fileList={state.fileList}
            downloadUrl={state.url}
          ></FileList>
        </Form.Item>
        <div className="footer-x">
          <Button type="primary" className="cancel-btn" onClick={goBack}>返回</Button>
        </div>
      </Form>
    </div>
  );
};
export default NoticeDetail;
